<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!-- saved from url=(0038)http://www.oschina.net/bbs/thread/9197 -->
<HTML lang="zh-CN" xml:lang="zh-CN" xmlns="http://www.w3.org/1999/xhtml"><HEAD><META http-equiv="Content-Type" content="text/html; charset=UTF-8">
  
  <META http-equiv="Content-Language" content="zh-CN">
  <META name="robots" content="index, follow">
  <META name="revisit-after" content="1 days">
  <META name="rating" content="general">
  <LINK rel="shortcut icon" type="image/x-icon" href="http://www.oschina.net/img/favicon.ico">
  <TITLE>jquery-easyui 中表格的行编辑功能 - 开源中国社区</TITLE>
  <META name="google-site-verification" content="4DH1xCJGE79fRHD7UKE0IwI_cdgpdDKr1f2THT9C78k">
    <META name="Keywords" content="jQuery EasyUI,jquery-easyui,中表格的行编辑功能">
      <META name="Description" content="datagrid现在具有行编辑能力了，使用时只须在columns中为需要编辑的列添加一个editor属性，编辑保存时同时具有数据校验能力。 看一个例子效果图： 具体实现代码如下： &lt;table id=&quot;tt&quot;&gt;&lt;/table&gt;
$(&#39;#tt&#39;).datagrid({
    title:&#39;Editable DataGrid&#39;,
    iconCls:&#39;icon-edit&#39;,
    width:660,
    height:250,
    singl...">
    <LINK rel="stylesheet" href="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/oschina.css" type="text/css" media="screen">
  <LINK rel="stylesheet" href="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/thickbox.css" type="text/css" media="screen">
  <SCRIPT type="text/javascript" src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/jquery.js"></SCRIPT>
  <SCRIPT type="text/javascript" src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/jquery.form.js"></SCRIPT>
  <SCRIPT type="text/javascript" src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/jquery.qtip-1.0.0-rc3.min.js"></SCRIPT>
  <SCRIPT type="text/javascript" src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/thickbox.js"></SCRIPT>
  <SCRIPT type="text/javascript" src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/common.js"></SCRIPT>
  <LINK rel="search" type="application/opensearchdescription+xml" href="http://www.oschina.net/open-search.xml" title="OSChina"> 
  <LINK rel="alternate" type="application/rss+xml" title="开源中国最新软件" href="http://www.oschina.net/project/rss">
  <LINK rel="alternate" type="application/rss+xml" title="开源中国最新新闻" href="http://www.oschina.net/news/rss">
  <LINK rel="alternate" type="application/rss+xml" title="开源中国最新讨论话题" href="http://www.oschina.net/bbs/rss">
  <LINK rel="alternate" type="application/rss+xml" title="开源中国最新博客" href="http://www.oschina.net/blog/rss">
  <STYLE>
    body,table,input,textarea,select {font-family:Verdana,sans-serif;}
  </STYLE>
<LINK rel="stylesheet" href="http://www.oschina.net/js/tiny_mce_3241/themes/advanced/skins/default/ui.css"><LINK rel="stylesheet" href="http://www.oschina.net/js/tiny_mce_3241/plugins/inlinepopups/skins/clearlooks2/window.css"></HEAD><BODY>
<DIV id="OSC_Screen">
	<DIV id="OSC_Banner" class="CenterDiv">
		<TABLE width="100%" cellspacing="0" cellpadding="0" border="0">
		<TBODY><TR>
			<TD rowspan="2" width="200">
				<A href="http://www.oschina.net/"><IMG src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/logo.gif" alt="开源中国社区" title="开源中国社区首页"></A>
			</TD>
			<TD colspan="2" align="right" valign="top">
				<DIV id="userbar">	<A href="http://www.oschina.net/action/user/openid?op=Google" class="hl">使用Gmail账号登录</A>&nbsp;|
	<A href="http://www.oschina.net/home/login">登录</A>&nbsp;|
	<A href="http://www.oschina.net/home/reg">注册</A>&nbsp;|
	<A href="http://www.oschina.net/bbs/new_thread?forum=1" class="hl">我要提问</A>&nbsp;|
	<A href="http://www.oschina.net/home/go?page=admin%2Fnew-project" class="hl">发布开源软件</A>&nbsp;|
	<A href="http://www.oschina.net/home/go?page=admin%2Fnew-release" class="hl">新闻投递</A></DIV>
			</TD>
		</TR>
		<TR>
			<TD id="slogon">
				今天是：<SPAN class="holiday">国际电影节[1932]</SPAN>
			</TD>
			<TD id="rss">
				<A href="http://www.oschina.net/project/rss">开源软件</A>
				<A href="http://www.oschina.net/news/rss">新闻</A>
				<A href="http://www.oschina.net/bbs/rss">讨论</A>
				<A href="http://www.oschina.net/blog/rss">博客</A>
			</TD>
		</TR>
		</TBODY></TABLE>
	</DIV>
	<DIV id="OSC_MainNav">
		<DIV class="CenterDiv">
    		<UL>
    			<LI class="t_home"><A href="http://www.oschina.net/">首页</A></LI>
    			<LI class="t_project"><A href="http://www.oschina.net/project">开源软件</A></LI>
    			<LI class="t_news"><A href="http://www.oschina.net/news">新闻资讯</A></LI>
    			<LI class="t_bbs current"><A href="http://www.oschina.net/bbs">讨论区</A></LI>
    			<LI class="t_blog last"><A href="http://www.oschina.net/blog">博客</A></LI>    						
    		</UL>
    		<FORM action="http://www.oschina.net/home/search">
								<INPUT type="hidden" name="scope" value="bbs">
								    			<INPUT type="text" id="txt_q" name="q" class="SERACH " value="搜索讨论区话题" onblur="(this.value==&#39;&#39;)?this.value=&#39;搜索讨论区话题&#39;:this.value" onfocus="if(this.value==&#39;搜索讨论区话题&#39;){this.value=&#39;&#39;;};this.select();">
				<INPUT type="image" src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/search_btn.png" style="margin:0 0 0 3px;outline:0">
    		</FORM>
			<DIV class="clear"></DIV>
		</DIV>
		<DIV class="clear"></DIV>
	</DIV>
	<DIV class="clear"></DIV>
	<DIV id="OSC_Content" class="CenterDiv">
<DIV class="ThreadMain" style="margin-top:10px;">
<DIV class="ThreadPath">
<A href="http://www.oschina.net/bbs" name="top">讨论区首页</A>&nbsp;»
<A href="http://www.oschina.net/bbs/forum/1/development?p=1">技术开发交流</A>&nbsp;»
<A href="http://www.oschina.net/p/jquery+easyui">jQuery EasyUI</A>
</DIV>
<H1 class="ThreadTitle thread_type_1">
	<SPAN class="ThreadNav">
		<A href="http://www.oschina.net/bbs/thread/9196" title="https与http之间的自动跳转问题请教？">上一话题</A>&nbsp;|
	<A href="http://www.oschina.net/bbs/thread/9198" title="使用 jQuery EasyUI 创建菜单">下一话题</A>	</SPAN>
	jquery-easyui 中表格的行编辑功能
</H1>
<TABLE width="100%" cellspacing="0" cellpadding="0">
<TBODY><TR>
<TD>
	<A href="http://www.oschina.net/bbs/new_thread?forum=1"><IMG src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/post.gif"></A>
	<A href="http://www.oschina.net/bbs/thread/9197#postform"><IMG src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/reply.gif"></A>
</TD>
<TD align="right">	</TD>
</TR>
</TBODY></TABLE>
<TBOTTOM>
	</TBOTTOM><TBOTTOM>
	</TBOTTOM><TABLE id="ThreadTable" style="margin-top:5px;" cellspacing="1" cellpadding="1" width="100%">
<THEAD>
	<TR><TD>作 者</TD><TD>话 题 正 文</TD></TR>
</THEAD>
<TBODY id="posts">
		<TR class="Thread">
		<TD class="ThreadAuthor">
			<A href="http://www.oschina.net/user/54100"><IMG src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/54100_100.jpg" align="absmiddle" alt="贱客" title="贱客" class="LargePortrait"></A>
			<DIV class="UserOutline">
				<A href="http://www.oschina.net/user/54100">贱客</A>
			</DIV>
			<P class="region">吉林 长春</P>
			<UL class="opts">
												<A href="http://my.oschina.net/javaeye">空间</A>&nbsp;|
				<A href="http://my.oschina.net/javaeye/blog">博客</A>&nbsp;|
								<A href="javascript:sendmsg(54100)">发送留言</A>
			</UL>
			<P class="times">
				加入时间:2010-01-24<BR>
				最近登录:2小时前
			</P>
		</TD>
		<TD class="ThreadBody">
			<DIV class="Outline">
				<SPAN style="float:right;">
										<EM id="p_attention_count">1</EM>人关注此话题，
    				<SPAN id="attention_it">
    				            			<A href="javascript:pay_attention(9197,true)" style="color:#3E62A6">我要关注(收藏)</A>(<A href="http://www.oschina.net/help/favorite?modal=true&height=300" title="什么是关注" class="thickbox">?</A>)
    				    				</SPAN>
                	|&nbsp;<A href="http://www.oschina.net/bbs/new_post?thread=9197">回复此话题</A>				</SPAN>
				<SPAN class="stat">
            	1楼 发表于 2010-06-17 13:21 (1个月前)，
            	<A href="http://www.oschina.net/bbs/thread/9197#postlist">0回</A> /322阅，
				最后回复：无				</SPAN>
				<DIV class="clear"></DIV>
			</DIV>
			<DIV class="TextContent">
								<DIV id="ProjectsOfThread">
					<H4><A href="javascript:close_projects()" title="关闭相关软件的显示">X</A>相关的软件</H4>
					<UL>
												<LI><A href="http://www.oschina.net/p/jquery+easyui"><B>jQuery EasyUI</B></A></LI>
											</UL>
				</DIV>
								<P><SPAN style="font-family: Tahoma; line-height: 18px; font-size: 12px; -webkit-border-horizontal-spacing: 1px; -webkit-border-vertical-spacing: 1px;">
</SPAN></P><P style="padding: 0px; margin: 0px;">datagrid现在具有行编辑能力了，使用时只须在columns中为需要编辑的列添加一个editor属性，编辑保存时同时具有数据校验能力。</P>
<P style="padding: 0px; margin: 0px;">看一个例子效果图：</P>
<P></P>
<P><A href="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/17132141_F7nf.png" target="_blank"><IMG src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/17132141_F7nf.png" alt="" width="665" height="308" style="cursor: pointer; "></A></P>
<P>具体实现代码如下：</P>
<P>
</P><DIV class="dp-highlighter"><DIV class="bar"><DIV class="tools"><A href="http://www.oschina.net/bbs/thread/9197#" onclick="dp.sh.Toolbar.Command(&#39;ViewSource&#39;,this);return false;">源码</A><A href="http://www.oschina.net/bbs/thread/9197#" onclick="dp.sh.Toolbar.Command(&#39;PrintSource&#39;,this);return false;">打印</A><A href="http://www.oschina.net/bbs/thread/9197#" onclick="dp.sh.Toolbar.Command(&#39;About&#39;,this);return false;">？</A></DIV></DIV><OL start="1" class="dp-c"><LI class="alt"><SPAN><SPAN>&lt;table&nbsp;id=</SPAN><SPAN class="string">"tt"</SPAN><SPAN>&gt;&lt;/table&gt;&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>$(<SPAN class="string">'#tt'</SPAN><SPAN>).datagrid({&nbsp;&nbsp;</SPAN></SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;title:<SPAN class="string">'Editable&nbsp;DataGrid'</SPAN><SPAN>,&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;iconCls:<SPAN class="string">'icon-edit'</SPAN><SPAN>,&nbsp;&nbsp;</SPAN></SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;width:660,&nbsp;&nbsp;</SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;height:250,&nbsp;&nbsp;</SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;singleSelect:<SPAN class="keyword">true</SPAN><SPAN>,&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;idField:<SPAN class="string">'itemid'</SPAN><SPAN>,&nbsp;&nbsp;</SPAN></SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;url:<SPAN class="string">'datagrid_data.json'</SPAN><SPAN>,&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;columns:[[&nbsp;&nbsp;</SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{field:<SPAN class="string">'itemid'</SPAN><SPAN>,title:</SPAN><SPAN class="string">'Item&nbsp;ID'</SPAN><SPAN>,width:60},&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{field:<SPAN class="string">'productid'</SPAN><SPAN>,title:</SPAN><SPAN class="string">'Product'</SPAN><SPAN>,width:100,&nbsp;&nbsp;</SPAN></SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;formatter:<SPAN class="keyword">function</SPAN><SPAN>(value){&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<SPAN class="keyword">for</SPAN><SPAN>(</SPAN><SPAN class="keyword">var</SPAN><SPAN>&nbsp;i=0;&nbsp;i&lt;products.length;&nbsp;i++){&nbsp;&nbsp;</SPAN></SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<SPAN class="keyword">if</SPAN><SPAN>&nbsp;(products[i].productid&nbsp;==&nbsp;value)&nbsp;</SPAN><SPAN class="keyword">return</SPAN><SPAN>&nbsp;products[i].name;&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;</SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<SPAN class="keyword">return</SPAN><SPAN>&nbsp;value;&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;},&nbsp;&nbsp;</SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;editor:{&nbsp;&nbsp;</SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;type:<SPAN class="string">'combobox'</SPAN><SPAN>,&nbsp;&nbsp;</SPAN></SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;options:{&nbsp;&nbsp;</SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;valueField:<SPAN class="string">'productid'</SPAN><SPAN>,&nbsp;&nbsp;</SPAN></SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;textField:<SPAN class="string">'name'</SPAN><SPAN>,&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;data:products,&nbsp;&nbsp;</SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;required:<SPAN class="keyword">true</SPAN><SPAN>&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;</SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;</SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;},&nbsp;&nbsp;</SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{field:<SPAN class="string">'listprice'</SPAN><SPAN>,title:</SPAN><SPAN class="string">'List&nbsp;Price'</SPAN><SPAN>,width:80,align:</SPAN><SPAN class="string">'right'</SPAN><SPAN>,editor:{type:</SPAN><SPAN class="string">'numberbox'</SPAN><SPAN>,options:{precision:1}}},&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{field:<SPAN class="string">'unitcost'</SPAN><SPAN>,title:</SPAN><SPAN class="string">'Unit&nbsp;Cost'</SPAN><SPAN>,width:80,align:</SPAN><SPAN class="string">'right'</SPAN><SPAN>,editor:</SPAN><SPAN class="string">'numberbox'</SPAN><SPAN>},&nbsp;&nbsp;</SPAN></SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{field:<SPAN class="string">'attr1'</SPAN><SPAN>,title:</SPAN><SPAN class="string">'Attribute'</SPAN><SPAN>,width:150,editor:</SPAN><SPAN class="string">'text'</SPAN><SPAN>},&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{field:<SPAN class="string">'status'</SPAN><SPAN>,title:</SPAN><SPAN class="string">'Status'</SPAN><SPAN>,width:50,align:</SPAN><SPAN class="string">'center'</SPAN><SPAN>,&nbsp;&nbsp;</SPAN></SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;editor:{&nbsp;&nbsp;</SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;type:<SPAN class="string">'checkbox'</SPAN><SPAN>,&nbsp;&nbsp;</SPAN></SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;options:{&nbsp;&nbsp;</SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;on:&nbsp;<SPAN class="string">'P'</SPAN><SPAN>,&nbsp;&nbsp;</SPAN></SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;off:&nbsp;<SPAN class="string">''</SPAN><SPAN>&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;</SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;</SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;},&nbsp;&nbsp;</SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{field:<SPAN class="string">'action'</SPAN><SPAN>,title:</SPAN><SPAN class="string">'Action'</SPAN><SPAN>,width:70,align:</SPAN><SPAN class="string">'center'</SPAN><SPAN>,&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;formatter:<SPAN class="keyword">function</SPAN><SPAN>(value,row,index){&nbsp;&nbsp;</SPAN></SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<SPAN class="keyword">if</SPAN><SPAN>&nbsp;(row.editing){&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<SPAN class="keyword">var</SPAN><SPAN>&nbsp;s&nbsp;=&nbsp;</SPAN><SPAN class="string">'&lt;a&nbsp;href="#"&nbsp;onclick="saverow('</SPAN><SPAN>+index+</SPAN><SPAN class="string">')"&gt;Save&lt;/a&gt;&nbsp;'</SPAN><SPAN>;&nbsp;&nbsp;</SPAN></SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<SPAN class="keyword">var</SPAN><SPAN>&nbsp;c&nbsp;=&nbsp;</SPAN><SPAN class="string">'&lt;a&nbsp;href="#"&nbsp;onclick="cancelrow('</SPAN><SPAN>+index+</SPAN><SPAN class="string">')"&gt;Cancel&lt;/a&gt;'</SPAN><SPAN>;&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<SPAN class="keyword">return</SPAN><SPAN>&nbsp;s+c;&nbsp;&nbsp;</SPAN></SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;<SPAN class="keyword">else</SPAN><SPAN>&nbsp;{&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<SPAN class="keyword">var</SPAN><SPAN>&nbsp;e&nbsp;=&nbsp;</SPAN><SPAN class="string">'&lt;a&nbsp;href="#"&nbsp;onclick="editrow('</SPAN><SPAN>+index+</SPAN><SPAN class="string">')"&gt;Edit&lt;/a&gt;&nbsp;'</SPAN><SPAN>;&nbsp;&nbsp;</SPAN></SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<SPAN class="keyword">var</SPAN><SPAN>&nbsp;d&nbsp;=&nbsp;</SPAN><SPAN class="string">'&lt;a&nbsp;href="#"&nbsp;onclick="deleterow('</SPAN><SPAN>+index+</SPAN><SPAN class="string">')"&gt;Delete&lt;/a&gt;'</SPAN><SPAN>;&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<SPAN class="keyword">return</SPAN><SPAN>&nbsp;e+d;&nbsp;&nbsp;</SPAN></SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;</SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;</SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;</SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;]],&nbsp;&nbsp;</SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;onBeforeEdit:<SPAN class="keyword">function</SPAN><SPAN>(index,row){&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;row.editing&nbsp;=&nbsp;<SPAN class="keyword">true</SPAN><SPAN>;&nbsp;&nbsp;</SPAN></SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$(<SPAN class="string">'#tt'</SPAN><SPAN>).datagrid(</SPAN><SPAN class="string">'refreshRow'</SPAN><SPAN>,&nbsp;index);&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;},&nbsp;&nbsp;</SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;onAfterEdit:<SPAN class="keyword">function</SPAN><SPAN>(index,row){&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;row.editing&nbsp;=&nbsp;<SPAN class="keyword">false</SPAN><SPAN>;&nbsp;&nbsp;</SPAN></SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$(<SPAN class="string">'#tt'</SPAN><SPAN>).datagrid(</SPAN><SPAN class="string">'refreshRow'</SPAN><SPAN>,&nbsp;index);&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;},&nbsp;&nbsp;</SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;onCancelEdit:<SPAN class="keyword">function</SPAN><SPAN>(index,row){&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;row.editing&nbsp;=&nbsp;<SPAN class="keyword">false</SPAN><SPAN>;&nbsp;&nbsp;</SPAN></SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$(<SPAN class="string">'#tt'</SPAN><SPAN>).datagrid(</SPAN><SPAN class="string">'refreshRow'</SPAN><SPAN>,&nbsp;index);&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;</SPAN></LI><LI class="alt"><SPAN>});&nbsp;&nbsp;</SPAN></LI></OL></DIV><PRE class="JavaScript" style="display: none; ">&lt;table id="tt"&gt;&lt;/table&gt;
$('#tt').datagrid({
    title:'Editable DataGrid',
    iconCls:'icon-edit',
    width:660,
    height:250,
    singleSelect:true,
    idField:'itemid',
    url:'datagrid_data.json',
    columns:[[
        {field:'itemid',title:'Item ID',width:60},
        {field:'productid',title:'Product',width:100,
            formatter:function(value){
                for(var i=0; i&lt;products.length; i++){
                    if (products[i].productid == value) return products[i].name;
                }
                return value;
            },
            editor:{
                type:'combobox',
                options:{
                    valueField:'productid',
                    textField:'name',
                    data:products,
                    required:true
                }
            }
        },
        {field:'listprice',title:'List Price',width:80,align:'right',editor:{type:'numberbox',options:{precision:1}}},
        {field:'unitcost',title:'Unit Cost',width:80,align:'right',editor:'numberbox'},
        {field:'attr1',title:'Attribute',width:150,editor:'text'},
        {field:'status',title:'Status',width:50,align:'center',
            editor:{
                type:'checkbox',
                options:{
                    on: 'P',
                    off: ''
                }
            }
        },
        {field:'action',title:'Action',width:70,align:'center',
            formatter:function(value,row,index){
                if (row.editing){
                    var s = '&lt;a href="#" onclick="saverow('+index+')"&gt;Save&lt;/a&gt; ';
                    var c = '&lt;a href="#" onclick="cancelrow('+index+')"&gt;Cancel&lt;/a&gt;';
                    return s+c;
                } else {
                    var e = '&lt;a href="#" onclick="editrow('+index+')"&gt;Edit&lt;/a&gt; ';
                    var d = '&lt;a href="#" onclick="deleterow('+index+')"&gt;Delete&lt;/a&gt;';
                    return e+d;
                }
            }
        }
    ]],
    onBeforeEdit:function(index,row){
        row.editing = true;
        $('#tt').datagrid('refreshRow', index);
    },
    onAfterEdit:function(index,row){
        row.editing = false;
        $('#tt').datagrid('refreshRow', index);
    },
    onCancelEdit:function(index,row){
        row.editing = false;
        $('#tt').datagrid('refreshRow', index);
    }
});</PRE>
<P></P>
<P><SPAN style="font-family: verdana, arial, helvetica, sans-serif; line-height: normal;">To enable editing in datagrid, you should add a editor property to the columns. The editor tells datagrid how to edit the field and how to save the field value. As you can see we define three editor:text,combobox and checkbox.</SPAN></P>
<P>
</P><DIV class="dp-highlighter"><DIV class="bar"><DIV class="tools"><A href="http://www.oschina.net/bbs/thread/9197#" onclick="dp.sh.Toolbar.Command(&#39;ViewSource&#39;,this);return false;">源码</A><A href="http://www.oschina.net/bbs/thread/9197#" onclick="dp.sh.Toolbar.Command(&#39;PrintSource&#39;,this);return false;">打印</A><A href="http://www.oschina.net/bbs/thread/9197#" onclick="dp.sh.Toolbar.Command(&#39;About&#39;,this);return false;">？</A></DIV></DIV><OL start="1" class="dp-c"><LI class="alt"><SPAN><SPAN class="keyword">function</SPAN><SPAN>&nbsp;editrow(index){&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;$(<SPAN class="string">'#tt'</SPAN><SPAN>).datagrid(</SPAN><SPAN class="string">'beginEdit'</SPAN><SPAN>,&nbsp;index);&nbsp;&nbsp;</SPAN></SPAN></LI><LI class="alt"><SPAN>}&nbsp;&nbsp;</SPAN></LI><LI class=""><SPAN><SPAN class="keyword">function</SPAN><SPAN>&nbsp;deleterow(index){&nbsp;&nbsp;</SPAN></SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;$.messager.confirm(<SPAN class="string">'Confirm'</SPAN><SPAN>,</SPAN><SPAN class="string">'Are&nbsp;you&nbsp;sure?'</SPAN><SPAN>,</SPAN><SPAN class="keyword">function</SPAN><SPAN>(r){&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<SPAN class="keyword">if</SPAN><SPAN>&nbsp;(r){&nbsp;&nbsp;</SPAN></SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$(<SPAN class="string">'#tt'</SPAN><SPAN>).datagrid(</SPAN><SPAN class="string">'deleteRow'</SPAN><SPAN>,&nbsp;index);&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}&nbsp;&nbsp;</SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;});&nbsp;&nbsp;</SPAN></LI><LI class=""><SPAN>}&nbsp;&nbsp;</SPAN></LI><LI class="alt"><SPAN><SPAN class="keyword">function</SPAN><SPAN>&nbsp;saverow(index){&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;$(<SPAN class="string">'#tt'</SPAN><SPAN>).datagrid(</SPAN><SPAN class="string">'endEdit'</SPAN><SPAN>,&nbsp;index);&nbsp;&nbsp;</SPAN></SPAN></LI><LI class="alt"><SPAN>}&nbsp;&nbsp;</SPAN></LI><LI class=""><SPAN><SPAN class="keyword">function</SPAN><SPAN>&nbsp;cancelrow(index){&nbsp;&nbsp;</SPAN></SPAN></LI><LI class="alt"><SPAN>&nbsp;&nbsp;&nbsp;&nbsp;$(<SPAN class="string">'#tt'</SPAN><SPAN>).datagrid(</SPAN><SPAN class="string">'cancelEdit'</SPAN><SPAN>,&nbsp;index);&nbsp;&nbsp;</SPAN></SPAN></LI><LI class=""><SPAN>}&nbsp;&nbsp;</SPAN></LI></OL></DIV><PRE class="JavaScript" style="display: none; ">function editrow(index){
    $('#tt').datagrid('beginEdit', index);
}
function deleterow(index){
    $.messager.confirm('Confirm','Are you sure?',function(r){
        if (r){
            $('#tt').datagrid('deleteRow', index);
        }
    });
}
function saverow(index){
    $('#tt').datagrid('endEdit', index);
}
function cancelrow(index){
    $('#tt').datagrid('cancelEdit', index);
}</PRE>
<P></P>
<P>下载本文代码：<A href="http://jquery-easyui.wikidot.com/local--files/tutorial:datagrid12/easyui-datagrid-demo.zip">http://jquery-easyui.wikidot.com/local--files/tutorial:datagrid12/easyui-datagrid-demo.zip</A></P>
<P>英文原文：<A href="http://jquery-easyui.wikidot.com/tutorial:datagrid12">http://jquery-easyui.wikidot.com/tutorial:datagrid12</A></P>
			</DIV>
			        	        	<DIV class="RelatedThreads">
        	<STRONG>相关话题</STRONG>
        	<UL>
        				        	<LI><A href="http://www.oschina.net/bbs/thread/4273" title="jquery easyui 使用后的一些小问题"><SPAN class="highlight">jquery</SPAN> easyui 使用后的一些小问题</A><SPAN class="date">(0回/1205阅,4个月前)</SPAN></LI>
			        				        	<LI><A href="http://www.oschina.net/bbs/thread/9198" title="使用 jQuery EasyUI 创建菜单">使用 <SPAN class="highlight">jQuery</SPAN> EasyUI 创建菜单</A><SPAN class="date">(0回/208阅,1个月前)</SPAN></LI>
			        				        	<LI><A href="http://www.oschina.net/bbs/thread/4158" title="jQuery easyui这个是否有收费啊?"><SPAN class="highlight">jQuery</SPAN> easyui这个是否有收费啊?</A><SPAN class="date">(3回/1368阅,1个月前)</SPAN></LI>
			        				        	<LI><A href="http://www.oschina.net/bbs/thread/9470" title="Think in jQuery">Think in <SPAN class="highlight">jQuery</SPAN></A><SPAN class="date">(7回/1100阅,18天前)</SPAN></LI>
			        				        	<LI><A href="http://www.oschina.net/bbs/thread/3028" title="jQuery Litebox的网友评论"><SPAN class="highlight">jQuery</SPAN> Litebox的网友评论</A><SPAN class="date">(1回/197阅,1年前)</SPAN></LI>
			        				        	<LI><A href="http://www.oschina.net/bbs/thread/8799" title="jquery facebook登陆"><SPAN class="highlight">jquery</SPAN> facebook登陆</A><SPAN class="date">(0回/343阅,2个月前)</SPAN></LI>
			        				        	<LI><A href="http://www.oschina.net/bbs/thread/2910" title="jQuery的网友评论"><SPAN class="highlight">jQuery</SPAN>的网友评论</A><SPAN class="date">(14回/122阅,8个月前)</SPAN></LI>
			        				        	<LI><A href="http://www.oschina.net/bbs/thread/70" title="jQuery 1.3 升级指南"><SPAN class="highlight">jQuery</SPAN> 1.3 升级指南</A><SPAN class="date">(2回/552阅,1年前)</SPAN></LI>
			        				        	<LI><A href="http://www.oschina.net/bbs/thread/4317" title="Jquery 幻灯片效果"><SPAN class="highlight">Jquery</SPAN> 幻灯片效果</A><SPAN class="date">(2回/789阅,4个月前)</SPAN></LI>
			        				        	<LI><A href="http://www.oschina.net/bbs/thread/7973" title="jQuery 表格工具集"><SPAN class="highlight">jQuery</SPAN> 表格工具集</A><SPAN class="date">(4回/1515阅,3个月前)</SPAN></LI>
			        	        	</UL>
        	</DIV>
						<DIV style="margin:0 0 10px 10px;">
			<SCRIPT type="text/javascript"><!--
            google_ad_client = "pub-1307862221338762";
            /* bbs-topic-ad */
            google_ad_slot = "9796452689";
            google_ad_width = 728;
            google_ad_height = 90;
            //-->
            </SCRIPT>
            <SCRIPT type="text/javascript" src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/show_ads.js">
            </SCRIPT><SCRIPT src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/expansion_embed.js"></SCRIPT><SCRIPT src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/test_domain.js"></SCRIPT><SCRIPT>google_protectAndRun("ads_core.google_render_ad", google_handleError, google_render_ad);</SCRIPT><INS style="display:inline-table;border:none;height:90px;margin:0;padding:0;position:relative;visibility:visible;width:728px"><INS id="google_ads_frame1_anchor" style="display:block;border:none;height:90px;margin:0;padding:0;position:relative;visibility:visible;width:728px"><IFRAME allowtransparency="true" frameborder="0" height="90" hspace="0" id="google_ads_frame1" marginheight="0" marginwidth="0" name="google_ads_frame" scrolling="no" src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/ads.htm" style="left:0;position:absolute;top:0" vspace="0" width="728"></IFRAME></INS></INS>
			</DIV>
		</TD>
	</TR>
	<TR class="ThreadBottom">
		<TD class="ThreadAuthor"><A href="http://www.oschina.net/bbs/thread/9197#top">返回顶部</A></TD>
		<TD class="ThreadBody">
        				        	        	<A href="http://www.oschina.net/bbs/new_post?thread=9197">回复此话题</A> |		</TD>
	</TR>
	<TR class="splitter"><TD colspan="2"><A name="postlist"></A></TD></TR>
		</TBODY>
<TBODY><TR><TD class="ThreadAuthor"><TD class="ThreadBody" style="padding:10px;text-align:right;">	</TD></TR>

</TBODY>
<TBODY><TR>		<TD class="ThreadAuthor">
		<TD class="ThreadBody">
			<A name="postform"></A>
            <FORM id="form_post" action="http://www.oschina.net/action/discuss/create_post?project=0&thread=9197" method="POST">              
              <INPUT type="hidden" id="f_upload_spin" name="upload_img" value="">
              <DIV style="margin-bottom:10px;">
                <LABEL for="f_title">回复标题：</LABEL>
                <INPUT type="text" name="title" id="f_title" value="回复: jquery-easyui 中表格的行编辑功能" class="TEXT" style="width:400px;">
              </DIV>
              <DIV id="thread_content">
                <TEXTAREA name="content" id="f_content" style="width: 98%; height: 200px; display: none; "></TEXTAREA><SPAN id="f_content_parent" class="mceEditor defaultSkin"><TABLE id="f_content_tbl" class="mceLayout" cellspacing="0" cellpadding="0" style="width: 98%; height: 200px; "><TBODY><TR class="mceFirst"><TD class="mceToolbar mceLeft mceFirst mceLast"><A href="http://www.oschina.net/bbs/thread/9197#" accesskey="q" title="工具按钮- Alt+Q,编辑器- Alt-Z,组件位置- Alt-X"><!-- IE --></A><TABLE id="f_content_toolbar1" class="mceToolbar mceToolbarRow1 Enabled" cellpadding="0" cellspacing="0" align=""><TBODY><TR><TD class="mceToolbarStart mceToolbarStartButton mceFirst"><SPAN><!-- IE --></SPAN></TD><TD><A id="f_content_bold" href="javascript:;" class="mceButton mceButtonEnabled mce_bold" onmousedown="return false;" onclick="return false;" title="粗体(Ctrl+B)"><SPAN class="mceIcon mce_bold"></SPAN></A></TD><TD><A id="f_content_italic" href="javascript:;" class="mceButton mceButtonEnabled mce_italic" onmousedown="return false;" onclick="return false;" title="斜体(Ctrl+I)"><SPAN class="mceIcon mce_italic"></SPAN></A></TD><TD><A id="f_content_underline" href="javascript:;" class="mceButton mceButtonEnabled mce_underline" onmousedown="return false;" onclick="return false;" title="下划线(Ctrl+U)"><SPAN class="mceIcon mce_underline"></SPAN></A></TD><TD><A id="f_content_strikethrough" href="javascript:;" class="mceButton mceButtonEnabled mce_strikethrough" onmousedown="return false;" onclick="return false;" title="删除线"><SPAN class="mceIcon mce_strikethrough"></SPAN></A></TD><TD><TABLE id="f_content_forecolor" class="mceSplitButton mceSplitButtonEnabled mce_forecolor" cellpadding="0" cellspacing="0" onmousedown="return false;" title="前景色"><TBODY><TR><TD class="mceFirst"><A id="f_content_forecolor_action" href="javascript:;" class="mceAction mce_forecolor" onclick="return false;" onmousedown="return false;" title="前景色"><SPAN class="mceAction mce_forecolor"></SPAN><DIV id="f_content_forecolor_preview" class="mceColorPreview" style="background-color: rgb(136, 136, 136); "></DIV></A></TD><TD class="mceLast"><A id="f_content_forecolor_open" href="javascript:;" class="mceOpen mce_forecolor" onclick="return false;" onmousedown="return false;" title="前景色"><SPAN class="mceOpen mce_forecolor"></SPAN></A></TD></TR></TBODY></TABLE></TD><TD><TABLE id="f_content_backcolor" class="mceSplitButton mceSplitButtonEnabled mce_backcolor" cellpadding="0" cellspacing="0" onmousedown="return false;" title="背景色"><TBODY><TR><TD class="mceFirst"><A id="f_content_backcolor_action" href="javascript:;" class="mceAction mce_backcolor" onclick="return false;" onmousedown="return false;" title="背景色"><SPAN class="mceAction mce_backcolor"></SPAN><DIV id="f_content_backcolor_preview" class="mceColorPreview" style="background-color: rgb(136, 136, 136); "></DIV></A></TD><TD class="mceLast"><A id="f_content_backcolor_open" href="javascript:;" class="mceOpen mce_backcolor" onclick="return false;" onmousedown="return false;" title="背景色"><SPAN class="mceOpen mce_backcolor"></SPAN></A></TD></TR></TBODY></TABLE></TD><TD><SPAN class="mceSeparator"></SPAN></TD><TD><A id="f_content_justifyleft" href="javascript:;" class="mceButton mceButtonEnabled mce_justifyleft" onmousedown="return false;" onclick="return false;" title="左对齐"><SPAN class="mceIcon mce_justifyleft"></SPAN></A></TD><TD><A id="f_content_justifycenter" href="javascript:;" class="mceButton mceButtonEnabled mce_justifycenter" onmousedown="return false;" onclick="return false;" title="居中"><SPAN class="mceIcon mce_justifycenter"></SPAN></A></TD><TD><A id="f_content_justifyright" href="javascript:;" class="mceButton mceButtonEnabled mce_justifyright" onmousedown="return false;" onclick="return false;" title="右对齐"><SPAN class="mceIcon mce_justifyright"></SPAN></A></TD><TD><A id="f_content_blockquote" href="javascript:;" class="mceButton mceButtonEnabled mce_blockquote" onmousedown="return false;" onclick="return false;" title="引用"><SPAN class="mceIcon mce_blockquote"></SPAN></A></TD><TD><SPAN class="mceSeparator"></SPAN></TD><TD><A id="f_content_bullist" href="javascript:;" class="mceButton mceButtonEnabled mce_bullist" onmousedown="return false;" onclick="return false;" title="项目符号"><SPAN class="mceIcon mce_bullist"></SPAN></A></TD><TD><A id="f_content_numlist" href="javascript:;" class="mceButton mceButtonEnabled mce_numlist" onmousedown="return false;" onclick="return false;" title="编号"><SPAN class="mceIcon mce_numlist"></SPAN></A></TD><TD><SPAN class="mceSeparator"></SPAN></TD><TD><A id="f_content_link" href="javascript:;" class="mceButton mce_link mceButtonDisabled" onmousedown="return false;" onclick="return false;" title="插入/编辑超链接"><SPAN class="mceIcon mce_link"></SPAN></A></TD><TD><A id="f_content_unlink" href="javascript:;" class="mceButton mce_unlink mceButtonDisabled" onmousedown="return false;" onclick="return false;" title="取消超链接"><SPAN class="mceIcon mce_unlink"></SPAN></A></TD><TD><A id="f_content_hr" href="javascript:;" class="mceButton mceButtonEnabled mce_hr" onmousedown="return false;" onclick="return false;" title="插入水平线"><SPAN class="mceIcon mce_hr"></SPAN></A></TD><TD><A id="f_content_image" href="javascript:;" class="mceButton mceButtonEnabled mce_image" onmousedown="return false;" onclick="return false;" title="插入/编辑图像"><SPAN class="mceIcon mce_image"></SPAN></A></TD><TD><A id="f_content_emotions" href="javascript:;" class="mceButton mceButtonEnabled mce_emotions" onmousedown="return false;" onclick="return false;" title="表情图像"><SPAN class="mceIcon mce_emotions"></SPAN></A></TD><TD><SPAN class="mceSeparator"></SPAN></TD><TD><TABLE id="f_content_fontselect" cellpadding="0" cellspacing="0" class="mceListBox mceListBoxEnabled mce_fontselect"><TBODY><TR><TD class="mceFirst"><A id="f_content_fontselect_text" href="javascript:;" class="mceText mceTitle" onclick="return false;" onmousedown="return false;">字体</A></TD><TD class="mceLast"><A id="f_content_fontselect_open" tabindex="-1" href="javascript:;" class="mceOpen" onclick="return false;" onmousedown="return false;"><SPAN></SPAN></A></TD></TR></TBODY></TABLE></TD><TD><TABLE id="f_content_fontsizeselect" cellpadding="0" cellspacing="0" class="mceListBox mceListBoxEnabled mce_fontsizeselect"><TBODY><TR><TD class="mceFirst"><A id="f_content_fontsizeselect_text" href="javascript:;" class="mceText mceTitle" onclick="return false;" onmousedown="return false;">文字大小</A></TD><TD class="mceLast"><A id="f_content_fontsizeselect_open" tabindex="-1" href="javascript:;" class="mceOpen" onclick="return false;" onmousedown="return false;"><SPAN></SPAN></A></TD></TR></TBODY></TABLE></TD><TD class="mceToolbarEnd mceToolbarEndListBox mceLast"><SPAN><!-- IE --></SPAN></TD></TR></TBODY></TABLE><A href="http://www.oschina.net/bbs/thread/9197#" accesskey="z" title="工具按钮- Alt+Q,编辑器- Alt-Z,组件位置- Alt-X" onfocus="tinyMCE.getInstanceById(&#39;f_content&#39;).focus();"><!-- IE --></A></TD></TR><TR class="mceLast"><TD class="mceIframeContainer mceFirst mceLast"><IFRAME id="f_content_ifr" src="javascript:""" frameborder="0" style="width: 100%; height: 177px; "></IFRAME></TD></TR></TBODY></TABLE></SPAN>
              </DIV>
              <DIV id="error_msg" class="error_msg" style="display:none;"></DIV>
              <DIV class="Buttons" style="margin-top:10px;">
            	<INPUT type="button" value="快速回复" class="SUBMIT" onclick="postit()">&nbsp;&nbsp;&nbsp;&nbsp;
				<INPUT type="checkbox" name="add_to_favorite" value="1" id="cb_add_favorite"> <LABEL for="cb_add_favorite"><STRONG>有新回帖时发邮件给我（关注此贴）</STRONG></LABEL>
				<SPAN style="color:#A00;margin-left:10px;">爱护开源中国，请您和谐评论，谢谢！</SPAN>
              </DIV>
            </FORM>
		</TD>
	</TR>

</TBODY></TABLE>
</DIV>
<LINK type="text/css" rel="stylesheet" href="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/SyntaxHighlighter.css">
<SCRIPT type="text/javascript" src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/tiny_mce.js"></SCRIPT>
<SCRIPT type="text/javascript">
<!--
tinyMCE.init({
	content_css : "/css/editor_content.css",
	language : "zh",
	mode : "exact",
	elements : "f_content",
	theme : "advanced",
	plugins : "safari,emotions,media,advimage,inlinepopups,noneditable,table",
		relative_urls : false,
	remove_script_host : false,
		button_tile_map : true,
	invalid_elements : "script,iframe",
	theme_advanced_buttons1 : "bold,italic,underline,strikethrough,forecolor,backcolor,separator,justifyleft,justifycenter,justifyright,blockquote,separator,bullist,numlist,separator,link,unlink,hr,image,emotions,separator,fontselect,fontsizeselect",
	theme_advanced_buttons2 : "",
	theme_advanced_buttons3 : "",
	theme_advanced_toolbar_location : "top",
	theme_advanced_toolbar_align : "left",
	theme_advanced_path_location : "none",
	theme_advanced_statusbar_location: "none",
	ask : false,
	tab_focus : ":prev,:next"
});
tinyMCE.baseURL = '/js/tiny_mce_3241';
//-->
</SCRIPT><SCRIPT type="text/javascript" src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/zh.js" onload="tinymce.dom.ScriptLoader._onLoad(this,&#39;http://www.oschina.net/js/tiny_mce_3241/langs/zh.js&#39;,0);"></SCRIPT><SCRIPT type="text/javascript" src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/editor_template.js" onload="tinymce.dom.ScriptLoader._onLoad(this,&#39;http://www.oschina.net/js/tiny_mce_3241/themes/advanced/editor_template.js&#39;,1);"></SCRIPT><SCRIPT type="text/javascript" src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/zh(1).js"></SCRIPT><SCRIPT type="text/javascript" src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/editor_plugin.js" onload="tinymce.dom.ScriptLoader._onLoad(this,&#39;http://www.oschina.net/js/tiny_mce_3241/plugins/safari/editor_plugin.js&#39;,2);"></SCRIPT><SCRIPT type="text/javascript" src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/editor_plugin(1).js" onload="tinymce.dom.ScriptLoader._onLoad(this,&#39;http://www.oschina.net/js/tiny_mce_3241/plugins/emotions/editor_plugin.js&#39;,3);"></SCRIPT><SCRIPT type="text/javascript" src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/editor_plugin(2).js" onload="tinymce.dom.ScriptLoader._onLoad(this,&#39;http://www.oschina.net/js/tiny_mce_3241/plugins/media/editor_plugin.js&#39;,4);"></SCRIPT><SCRIPT type="text/javascript" src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/editor_plugin(3).js" onload="tinymce.dom.ScriptLoader._onLoad(this,&#39;http://www.oschina.net/js/tiny_mce_3241/plugins/advimage/editor_plugin.js&#39;,5);"></SCRIPT><SCRIPT type="text/javascript" src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/editor_plugin(4).js" onload="tinymce.dom.ScriptLoader._onLoad(this,&#39;http://www.oschina.net/js/tiny_mce_3241/plugins/inlinepopups/editor_plugin.js&#39;,6);"></SCRIPT><SCRIPT type="text/javascript" src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/editor_plugin(5).js" onload="tinymce.dom.ScriptLoader._onLoad(this,&#39;http://www.oschina.net/js/tiny_mce_3241/plugins/noneditable/editor_plugin.js&#39;,7);"></SCRIPT><SCRIPT type="text/javascript" src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/editor_plugin(6).js" onload="tinymce.dom.ScriptLoader._onLoad(this,&#39;http://www.oschina.net/js/tiny_mce_3241/plugins/table/editor_plugin.js&#39;,8);"></SCRIPT>
<SCRIPT type="text/javascript" src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/thread" defer="defer"></SCRIPT>
<SCRIPT type="text/javascript" src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/shCore.js"></SCRIPT>
<SCRIPT type="text/javascript" src="./jquery-easyui 中表格的行编辑功能 - 开源中国社区_files/shSyntax.js"></SCRIPT>
<SCRIPT type="text/javascript">
<!--
$(document).ready(function() {
    $('#form_post').ajaxForm({
    	dataType: 'json',
        success: function(json) {
    		if(json.img){
    			$('#f_img').val("");
    			tinyMCE.get('f_content').execCommand('mceReplaceContent',false,"<img src='"+json.img+"'>");
    		}
    		else if(json.msg){			
        		$('#error_msg').hide();
        		$('#error_msg').html(json.msg);
        		$('#error_msg').show("fast");
    		}
    		else if(json.id){
    			jQuery.get("/bbs/show_post?_post_user="+json.user+"&_post_id="+json.post, function(data){
    				$('#posts').append(data);
    				tinyMCE.get('f_content').setContent('');
    			}); 
    		}
        }
    });
    $('.Thread .TextContent img').css('cursor','pointer');
    jQuery.each($('.Thread .TextContent img'),function(idx,v){
    	$(v).wrap("<a href='"+$(this).attr('src')+"' target='_blank'></a>");
    });
    $('#form_post').bind('form-pre-serialize', function(event,form,options,veto){
    	tinyMCE.triggerSave();
    });
    $("#form_post").ajaxStart(function(){
       if(tinyMCE && tinyMCE.get('f_content'))
       tinyMCE.get('f_content').setProgressState(1); // Show progress
    });
    $("#form_post").ajaxComplete(function(event,request, settings){
       if(tinyMCE && tinyMCE.get('f_content'))
       tinyMCE.get('f_content').setProgressState(0); // Show progress
    }); 
    dp.SyntaxHighlighter.HighlightAll(null, true, true); 
});

function close_projects(){
	$('#ProjectsOfThread').remove();
}

function postit(){
	login_and_do(function(msg){
		$('#form_post').submit();
		return true;
	});
	return false;
}

function mark_as_top(thread_id, as_top) {
	var args = "id="+thread_id+"&top="+as_top;
	ajax_post("/action/discuss/mark_as_top",args,function(html){
		alert(html);
	});
}

function lock_thread(thread_id, lock) {
	var args = "id="+thread_id+"&lock="+lock;
	ajax_post("/action/discuss/lock_thread",args,function(html){
		alert(html);
	});
}

function delete_thread(tid){
if(confirm("您确定要删除此话题吗？删除后无法恢复！"))
	ajax_post("/action/discuss/delete_thread?id="+tid,"",function(){
		location.href='/bbs/forum/1/development';
	});
}
function delete_post(uid,pid){
if(confirm("您确定要删除此回贴吗？删除后无法恢复！")) 
	ajax_post("/action/discuss/delete_post?id="+pid+"&user="+uid,"",function(){
		$('.post_'+uid+'_'+pid).fadeOut();
	});
}
function pay_attention(pid,concern_it){
	login_and_do(function(msg){
		if(concern_it){
			$("#p_attention_count").load("/action/favorite/add?mailnotify=true&type=2&id="+pid);
			$('#attention_it').html('<a href="javascript:pay_attention('+pid+',false)" style="color:#A00;">取消关注</a>');	
		}
		else{
			$("#p_attention_count").load("/action/favorite/cancel?type=2&id="+pid);
			$('#attention_it').html('<a href="javascript:pay_attention('+pid+',true)" style="color:#3E62A6;">关注此话题</a>');
		}
		tb_remove();
	});
}
//-->
</SCRIPT>
<!--[if lt IE 7]>
<script type="text/javascript" src="/js/minmax.js"></script>
<![endif]-->
<DIV class="clear"></DIV></DIV><DIV class="clear"></DIV>
	<DIV id="OSC_Footer" class="CenterDiv">© 开源中国社区(OsChina.NET) | <A href="http://www.oschina.net/home/about">关于我们</A> | <A href="mailto:lgdhappy@gmail.com">广告联系</A> | <A href="http://my.oschina.net/javayou">站长空间</A> | <A href="http://www.oschina.net/home/links">友情链接</A> | <A href="http://m.oschina.net/">开源中国手机版</A> | 粤ICP备08124133号

</DIV>
</DIV>
<SCRIPT type="text/javascript">
<!--
$('#txt_q').qtip({
   content: "<a href='/home/search?scope=project&q=%E6%93%8D%E4%BD%9C%E7%B3%BB%E7%BB%9F'>操作系统</a><a href='/home/search?scope=project&q=SNS'>SNS</a><a href='/home/search?scope=project&q=%E4%BA%91%E8%AE%A1%E7%AE%97'>云计算</a><a href='/home/search?scope=project&q=J2EE'>J2EE</a><a href='/home/search?scope=project&q=%E8%BF%9E%E6%8E%A5%E6%B1%A0'>连接池</a><a href='/home/search?scope=project&q=MVC'>MVC</a><a href='/home/search?scope=project&q=%E6%89%8B%E6%9C%BA'>手机</a><a href='/home/search?scope=project&q=Android'>Android</a><a href='/home/search?scope=project&q=iPhone'>iPhone</a><a href='/home/search?scope=project&q=%E6%95%B0%E6%8D%AE%E5%BA%93'>数据库</a><a href='/home/search?scope=project&q=Ajax'>Ajax</a><a href='/home/search?scope=project&q=%E5%BC%80%E5%8F%91%E5%B7%A5%E5%85%B7'>开发工具</a><a href='/home/search?scope=project&q=Eclipse'>Eclipse</a><a href='/home/search?scope=project&q=%E6%B8%B8%E6%88%8F'>游戏</a><a href='/home/search?scope=project&q=Linux'>Linux</a><a href='/home/search?scope=project&q=Java'>Java</a><a href='/home/search?scope=project&q=PHP'>PHP</a><a href='/home/search?scope=project&q=NoSQL'>NoSQL</a>",
   show: 'focus',
   hide: { when: 'unfocus', fixed: true },
   style: {
   	tip:true,
	background: '#EFE',
    color: 'black',
    border: {
       width: 4,
       radius: 5,
       color: '#090'
    },
	name:'green', 
	width: 300
   },
   position: {corner: {tooltip:'topLeft',target:'bottomLeft'},adjust: {x:10,y:0}}
});
//if (top.location != self.location)top.location=self.location;
//-->
</SCRIPT>


<!-- Generated by OsChina.NET (Fri Aug 06 09:35:11 CST 2010) 38ms --></BODY></HTML>